<template>
    <view>
        <!-- pages/order/addpingjia.wxml -->
        <header name="评价" :type="1"></header>

        <view class="pstar">
            <text>商品评价</text>
            <view>
                <image
                    :src="starIndex >= index + 1 ? '/static/pstars.png' : '/static/pstar.png'"
                    mode="aspectFit"
                    @tap="changestar"
                    :data-index="index"
                    v-for="(item, index) in 5"
                    :key="index"
                ></image>
            </view>
        </view>
        <view class="contents">
            <textarea placeholder="写下您对商品感受吧~" placeholder-style="color: rgba(36, 44, 54, 0.8);" @input="oninput"></textarea>
        </view>

        <view class="images">
            <!-- <view class="video">
    <image src="/static/play.png" mode="aspectFit"></image>
    <image src="/static/delimgvideo.png" mode="aspectFit"></image>
    <image src=""></image>
  </view> -->
            <view class="image" v-for="(item, index) in pics" :key="index">
                <image class="del" src="/static/delimgvideo.png" mode="aspectFit" @tap="delimg" :data-index="index"></image>

                <image class="img" :src="item" mode="aspectFill"></image>
            </view>
            <image src="/static/uploadimg.png" mode="aspectFit" @tap="upimg"></image>
            <!-- <image src="/static/uploadvideo.png" mode="aspectFit"></image> -->
        </view>

        <view class="isni" @tap="changeisni">
            <image :src="ishide ? '/static/checked.png' : '/static/check.png'" mode="aspectFit"></image>
            <text>匿名评价</text>
        </view>
        <view class="btns" @tap="submit">保存</view>
    </view>
</template>

<script>
import header from '../../components/header/headerBar.vue';
// pages/order/addpingjia.js
const app = getApp();
import http from '../../utils/config.js';
export default {
    components: {
        header
    },
    data() {
        return {
            starIndex: 0,
            ishide: 0,
            pics: [],
            content: ''
        };
    },
    /**
     * 生命周期函数--监听页面加载
     */
    onLoad: function (options) {},
    /**
     * 生命周期函数--监听页面初次渲染完成
     */
    onReady: function () {},
    /**
     * 生命周期函数--监听页面显示
     */
    onShow: function () {},
    /**
     * 生命周期函数--监听页面隐藏
     */
    onHide: function () {},
    /**
     * 生命周期函数--监听页面卸载
     */
    onUnload: function () {},
    /**
     * 页面相关事件处理函数--监听用户下拉动作
     */
    onPullDownRefresh: function () {},
    /**
     * 页面上拉触底事件的处理函数
     */
    onReachBottom: function () {},
    /**
     * 用户点击右上角分享
     */
    onShareAppMessage: function () {},
    methods: {
        changestar(e) {
            var index = e.currentTarget.dataset.index;
            this.setData({
                starIndex: index + 1
            });
        },

        oninput(e) {
            this.setData({
                content: e.detail.value
            });
        },

        upimg() {
            var _this = this;

            uni.chooseImage({
                count: 1,
                // 默认9
                sizeType: ['compressed'],
                // 可以指定是原图还是压缩图，默认二者都有
                sourceType: ['album', 'camera'],
                // 可以指定来源是相册还是相机，默认二者都有
                success: function (res) {
                    uni.showLoading({
                        title: '加载中'
                    });
                    var tempPath = res.tempFilePaths;

                    for (var i = 0; i < tempPath.length; i++) {
                        uni.uploadFile({
                            url: http.baseUrl + 'Api&a=upfiles',
                            filePath: tempPath[i],
                            name: 'file',

                            success(res2) {
                                var data = JSON.parse(res2.data);

                                _this.pics.push(data.data);

                                _this.setData({
                                    pics: _this.pics
                                });

                                uni.hideLoading({
                                    success: (res) => {}
                                });
                            }
                        });
                    }
                }
            });
        },

        delimg(e) {
            var index = e.currentTarget.dataset.index;
            this.pics.splice(index, 1);
            this.setData({
                pics: this.pics
            });
        },

        changeisni() {
            this.setData({
                ishide: this.ishide ? 0 : 1
            });
        },

        submit() {
            var _this = this;

            var data = {
                orderid: this.orderid,
                fen: this.starIndex,
                content: this.content,
                pics: this.pics,
                model: 'shop_goods',
                ishide: this.ishide
            };
            app.globalData
                .http()
                .upping(data)
                .then((res) => {})
                .catch((res) => {});
        }
    }
};
</script>
<style lang="scss"> 
@import 'main.scss';
@import './addpingjia.scss';
</style>
